<template>
<!-- //增增加增 -->
  <el-button type="primary" @click="add(props)" color="#BDB76B" :dark="isDark">+添加</el-button>
  <!-- <el-table :data="tableData" height="470" border stripe style="width: 100%"> -->
  <!-- <el-table :data="tableDataFromDB" height="470" stripe style="width: 100%"> -->
  <el-table :data="tableDataFromDB.slice((currentPage - 1) * pagesize, currentPage * pagesize)" height="470" stripe style="width: 100%">
    <!-- :data="tableData.slice((currentPage - 1) * pagesize, currentPage * pagesize) -->
    <el-table-column prop="departmentId" label="科室编号" width="80" />
    <el-table-column prop="departmentName" label="科室名称" width="120" />
    <el-table-column prop="level" label="科室层级" width="80" />
    <el-table-column prop="address" label="科室地址" width="150" />
    <el-table-column prop="parentId" label="父ID" width="80" />
    <el-table-column prop="createTime" label="建立时间" width="300" />
    <el-table-column fixed="right" label="操作" width="100">
      <template #default="row">
        <!-- //该改改改按钮 -->
        <el-icon :size="30" @click="handleClick(row)" color="#626aef" :dark="isDark"><Setting /></el-icon>
        <!-- 删除删按钮 -->
        <el-popconfirm title="确w定y要l删除该科室吗?" @confirm="del(row)">
          <template #reference>
            <el-icon :size="30" color="#EF3E61"><Failed /></el-icon>
          </template>
        </el-popconfirm>
      </template>
      <!-- //删除删按钮↑ -->
    </el-table-column>
  </el-table>
  <el-pagination
        layout="total,sizes,prev,pager,next,jumper"
        :total="tableDataFromDB.length"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-sizes="[5,10,15,20]"
        :page-size="pagesize"/>
  <!-- //增增加增的窗体↓ -->
  <el-dialog v-model="tianjiakeshi622" title="~`增加科室" width="30%">
    <el-form label-width="120px">
      <el-form-item label="科室名称_wyl">
        <el-input v-model="is_a_tianjiabianliang_622.departmentName" />
      </el-form-item>
       <el-form-item label="科室wyl层级">
        <el-input v-model="is_a_tianjiabianliang_622.level" />
      </el-form-item>
       <el-form-item label="科室地址Wyl">
        <el-input v-model="is_a_tianjiabianliang_622.address" />
      </el-form-item>
      <el-form-item label="fuid">
        <el-input v-model="is_a_tianjiabianliang_622.parentId" />
      </el-form-item>
    </el-form>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="tianjiakeshi622 = false">wyl取消添加</el-button>
        <el-button type="primary" @click="insert()" v-model="tianjiakeshi622"
          >确认添加</el-button>
      </span>
    </template>
  </el-dialog>
  <!-- //编辑 -->
  <el-dialog v-model="xiugaijiemian622" title="编辑" width="30%">
    <el-form label-width="120px">
      <el-form-item label="号_wyl">
        <el-input v-model="is_a_xiugaibianliang_622.departmentId" />
      </el-form-item>
      <el-form-item label="名_wyl">
        <el-input v-model="is_a_xiugaibianliang_622.departmentName" />
      </el-form-item>
      <el-form-item label="级_wyl">
        <el-input v-model="is_a_xiugaibianliang_622.level" />
      </el-form-item>
      <el-form-item label="地_wyl">
        <el-input v-model="is_a_xiugaibianliang_622.address" />
      </el-form-item>
      <el-form-item label="父_wyl">
        <el-input v-model="is_a_xiugaibianliang_622.parentId" />
      </el-form-item>
      <el-form-item label="时_wyl">
        <el-input v-model="is_a_xiugaibianliang_622.createTime" />
      </el-form-item>
    </el-form>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="xiugaijiemian622 = false">取消</el-button>
        <el-button type="primary" @click="edit()" v-model="xiugaijiemian622"
          >确认</el-button
        >
      </span>
    </template>
  </el-dialog>
  <font size="5" color="pink" face="SimSun">第三组20006380109+王胤霖+科室管理页面</font>
</template>
<script>
import { get } from '@/utils/request'
import { ElMessage } from 'element-plus'
export default {
  data() {
    return {
      currentPage: 1, //默认页码为1
      pagesize: 5, //默认一页显示10条

      xiugaijiemian622: false,//两两两两个项目的变量名和方法名要完全不同
      tianjiakeshi622: false,//添加窗体的可见性
      is_a_xiugaibianliang_622: {}, //对应了点击编辑按钮时的行数据
      is_a_tianjiabianliang_622:{},
      tableData: [
        {
          departmentId:'0',
          departmentName:'王胤霖',
          level:'1',
          address:'(Null)',
          parentId:'(Null)',
          createTime:'2022-06-21 19:32:00'
        },
        {
          departmentId:'1',
          departmentName:'内科',
          level:'1',
          address:'(Null)',
          parentId:'(Null)',
          createTime:'2022-03-25 15:03:18'
        },
        {
          department_id:'2',
          department_name:'外科',
          level:'1',
          address:'(Null)',
          parent_id:'(Null)',
          create_time:'2022-03-25 15:04:03'
        },
        {
          department_id:'3',
          department_name:'妇科',
          level:'1',
          address:'(Null)',
          parent_id:'(Null)',
          create_time:'2022-03-25 15:04:19'
        },
        {
          department_id:'4',
          department_name:'儿科',
          level:'1',
          address:'(Null)',
          parent_id:'(Null)',
          create_time:'2022-03-25 15:03:18'
        },
        {
          department_id:'5',
          department_name:'传染病',
          level:'1',
          address:'(Null)',
          parent_id:'(Null)',
          create_time:'2022-03-25 15:05:21'
        },
        {
          department_id:'6',
          department_name:'五官科',
          level:'1',
          address:'(Null)',
          parent_id:'(Null)',
          create_time:'2022-03-25 15:05:28'
        },
        {
          department_id:'7',
          department_name:'中医科',
          level:'1',
          address:'(Null)',
          parent_id:'(Null)',
          create_time:'2022-03-25 15:05:36'
        },
        {
          department_id:'8',
          department_name:'检验科',
          level:'1',
          address:'(Null)',
          parent_id:'(Null)',
          create_time:'2022-03-25 15:05:47'
        },
        {
          department_id:'9',
          department_name:'放射科',
          level:'1',
          address:'(Null)',
          parent_id:'(Null)',
          create_time:'2022-03-25 15:05:57'
        }
      ],
      tableDataFromDB: [ ]
    }
  },
  //网页初始化函数 网页启动时自动执行该函数
  //res:从该url地址返回的对象
  mounted(){
      get('/getAllDepartments').then((res)=>{
        console.log(res)
        this.tableDataFromDB = res.data
        console.log(this.tableDataFromDB)
      }
      )
  },
  methods: {
    //分页
    handleSizeChange (size) {
      console.log(size,'size');
      this.pagesize = size;
      console.log(this.pagesize); //每页下拉显示数据
    },
    handleCurrentChange (currentPage) {
      console.log(currentPage,'currentPage');
      this.currentPage = currentPage;
      console.log(this.currentPage); //点击第几页
    },
    //改
    handleClick(data) {
      this.is_a_xiugaibianliang_622 = data.row 
      this.xiugaijiemian622 = !this.xiugaijiemian622
    },
    //删除
    del(shanchuzhexinxi) {
      console.log(shanchuzhexinxi)
      get('/deleteDepartment',{departmentId:shanchuzhexinxi.row.departmentId}).then((res) => {
        ElMessage({
          message:'科室信息删除成wyl功',
          type:'success'
        })
        window.location.reload()
      })
    },
    edit() {
      this.xiugaijiemian622 =! this.xiugaijiemian622
      //console.log(this.is_a_xiugaibianliang_622)
      //调整日期格式
      var dt = new Date(this.is_a_xiugaibianliang_622.createTime)
       let year = dt.getFullYear()
       let month = dt.getMonth() + 1
       let date = dt.getDate()
       this.is_a_xiugaibianliang_622.createTime = year + '/' + month + '/' + date
       get('/updateDepartment', this.is_a_xiugaibianliang_622).then((res) => {
       console.log(res)
      ElMessage({
        message: 'wylwyl修改成功!',
        type: 'success'
      })
      
    })
    },
    add() {//未绑定变量
      this.tianjiakeshi622 = !this.tianjiakeshi622
    },
//增增加增
    insert(){//参数d
      this.tianjiakeshi622 =! this.tianjiakeshi622
      get('/addDepartment',this.is_a_tianjiabianliang_622).then((res) => {
        console.log(res.data)
        ElMessage({
          message:'科室信息添加成功',
          type:'success'
        })
        window.location.reload()
      })
    }
  }
}
</script>

